<template>
  <div class="home">
    <!-- <van-skeleton title avatar :row="5" /> -->
    <div class="mag">
      <div class="mag-left">
        <img src="https://img.alicdn.com/bao/uploaded/i4/1751740828/O1CN015J3Owq1HzGWdpWOHJ_!!0-item_pic.jpg_600x600q90.jpg" alt="">
      </div>
      <div class="mag-right">
        <p>Yunwen</p>
        <p>Yunwen123456</p>
      </div>
    </div>
    <van-list>
    <van-cell title="收藏" icon="location-o"  is-link />
    <van-cell title="订单" icon="location-o"  is-link />
    <van-cell title="待付款" icon="location-o"  is-link />
    <van-cell title="待发货" icon="location-o"  is-link />
    <van-cell title="已完成" icon="location-o"  is-link />
   </van-list>
  </div>
</template>

<script>
// @ is an alias to /src
export default {
  name: 'Home',
  components: {
  }
}
</script>
<style lang="scss" scoped>
.home{
  height: 100%;
  width: 100%;
  .mag{
    width: 100%;
    display: flex;
    flex-direction: row;
    margin-bottom: 20px;
    &-left{
      width: 60px;
      height:60px;
      border-radius: 50%;
      box-shadow:10px,10px,10px,#cccc;
      img{
        width: 100%;
        height: 100%;
        overflow: hidden;
      }
      margin: {
        left:20px;
        top: 20px;
        bottom: 20px;
      };
    }
    &-right{
      margin: {
        top: 20px;
        left: 10px;
      };
      p{
        font: 12px;
      }
    }
  }
}
.van-cell{
  margin: 10px 0;
}
</style>
